import * as mars3d from "mars3d"
import { toRaw } from 'vue';

export const usePopup = (_graphicLayer) => {
  let graphicLayer: any = null

  const initPopup = () => {
    graphicLayer = toRaw(_graphicLayer.value); 

    graphicLayer.bindPopup(function (event) {
      const attr = event.graphic.attr || {}
      attr["类型"] = event.graphic.type
      attr["来源"] = "我是layer上绑定的Popup"
      attr["备注"] = "我支持鼠标交互"
  
      return mars3d.Util.getTemplateHtml({ title: "矢量图层", template: "all", attr })
    })
  }

  return {
    initPopup,
  }
}